import 'package:day_demo/src/nested_scroll_page/custom_tabbarview.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';

class NestedScrollPageExample extends StatefulWidget {
  const NestedScrollPageExample({super.key});

  @override
  State<NestedScrollPageExample> createState() =>
      _NestedScrollPageExampleState();
}

class _NestedScrollPageExampleState extends State<NestedScrollPageExample> {
  List<Widget> pages = [];
  int currentIndex = 0;
  var key1 = const PageStorageKey<String>('key1');

  var key2 = const PageStorageKey<String>('key2');
  @override
  void initState() {
    pages = [
      _tabView(),
      _tabView(true),
    ];
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Builder(builder: (ctx) {
        return DefaultTabController(
          length: 2,
          child: Stack(
            children: [
              // NestedScrollViewPlus(
              //   key: myKey,
              //   overscrollBehavior: OverscrollBehavior.outer,
              //   headerSliverBuilder: (_, __) {
              //     return [
              //       SliverAppBar(
              //         pinned: true,
              //         elevation: 8.0,
              //         automaticallyImplyLeading: false,
              //         shadowColor: Colors.black.withOpacity(0.3),
              //         expandedHeight: 200,
              //         backgroundColor: Colors.white,
              //         flexibleSpace: FlexibleSpaceBar(
              //           background: Container(
              //             color: Colors.red,
              //             height: 100,
              //           ),
              //           collapseMode: CollapseMode.parallax,
              //         ),
              //         bottom: PreferredSize(
              //           preferredSize: Size.fromHeight(40),
              //           child: Container(
              //             color: Colors.blue,
              //           ),
              //         ),
              //       ),
              //       const SliverToBoxAdapter(
              //         child: SizedBox(
              //           height: 44,
              //         ),
              //       ),
              //     ];
              //   },
              //   body: TabBarView(children: [
              //     CustomScrollView(
              //       slivers: [
              //         tabView(),
              //       ],
              //     ),
              //     CustomScrollView(
              //       slivers: [
              //         tabView(true),
              //       ],
              //     )
              //   ]),
              // ),
              Positioned(
                top: 100,
                left: 100,
                child: ElevatedButton(
                    onPressed: () {
                      setState(() {
                        currentIndex = currentIndex == 0 ? 1 : 0;
                      });
                    },
                    child: const Text("切换")),
              ),
            ],
          ),
        );
      }),
    );
  }

  Widget _tabView([bool reverse = false]) => CustomScrollView(
        key: reverse ? key2 : key1,
        physics: const NeverScrollableScrollPhysics(),
        // physics: const BouncingScrollPhysics(
        //   parent: AlwaysScrollableScrollPhysics(),
        // ),
        slivers: <Widget>[
          SliverFixedExtentList(
            delegate: SliverChildBuilderDelegate(
              (_, index) => Container(
                key: Key('$reverse-$index'),
                color: index.isEven ? Colors.white : Colors.grey[100],
                child: Center(
                  child: Text('ListTile ${reverse ? 20 - index : index + 1}'),
                ),
              ),
              childCount: 20,
            ),
            itemExtent: 60,
          ),
          SliverToBoxAdapter(
            child: Container(
              height: 100,
              color: Colors.red,
              child: Center(
                child: Text('$reverse'),
              ),
            ),
          )
        ],
      );
}
